<template>
	<div>
		<!-- 开启滑动 -->
		<scroll-view scroll-y="true">
			<div @click="userInfo()" style="display: flex;align-items: center;margin: 1em 0;background-color: #ffffff;padding: .5em 0;">
				<div class="profile">
					<!-- 用户头像 -->
					<open-data type="userAvatarUrl"></open-data>
				</div>
				<div style="margin-left: 1em;">
					<open-data type="userNickName" />
				</div>
			</div>

			<div style="margin: 10px 0;">
				<van-cell is-link title="账号安全" link-type="navigateTo" url="./pages/my/set.vue" />
			</div>

			<van-cell is-link title="我的城市" link-type="navigateTo" url="./pages/my/set.vue">
				<span class="cityColor">全国</span>
			</van-cell>
			<van-cell is-link title="我的兴趣" link-type="navigateTo" url="./pages/my/set.vue" />
			<van-cell is-link title="个性化推荐" link-type="navigateTo" url="./pages/my/set.vue" />
			<div class="exitStyle">
				<van-cell is-link title="关于我们" link-type="navigateTo" url="./pages/my/set.vue" />
			</div>
			<div class="exitStyle">
				<van-button type="primary" block>退出登录</van-button>
			</div>
		</scroll-view>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				msg: 'Hello'
			}
		},
		methods: {
			userInfo(){
				uni.navigateTo({
					url: "/pages/my/userinfo"
				})
			}
		}
	}
</script>

<style>
	.cityColor {
		color: #18BC37;
	}

	.exitStyle {
		padding-top: 10px;
	}

	.profile {
		margin-left: 2%;
		overflow: hidden;
		display: block;
		width: 75px;
		height: 75px;
		border-radius: 50%;
		border: 2px solid #fff;
	}

	.netname {
		padding-left: 10px;
	}
</style>
